<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../js/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../../css/common.css" media="all">
    <script src="../../js/layui/layui.all.js"></script>
    <script src="../../js/token.js"></script>
    <script src="../../js/config.js"></script>
</head>
<body>

<div class="layui-fluid">
    <div class="layui-form-item">
        <lable class="layui-form-label">角色名称:</lable>
        <div class="layui-input-block">
            <input type="text" class="layui-input"
                   style="width: 30%" id="rolename" lay-verify="required">
        </div>
    </div>
    <div class="layui-form-item">
        <lable class="layui-form-label">请选择角色权限:</lable>
        <div class="layui-input-block">
            <ul id="demo1"></ul>
        </div>
    </div>
    <div style="text-align: center;">
        <button class="layui-btn layuiadmin-btn-admin save">提交</button>
    </div>
</div>
</body>

<script>
    var $ = layui.$ //由于layer弹层依赖jQuery，所以可以直接得到
    var layer = layui.layer
    var tree = layui.tree;
    var Alldata;
    var array=[];
    $.ajax({
       type:'post',
       url:HOST+'admin/permission/findAllPermission',
        async:false,
        success:function (data) {
           if (data.code == 200) {
               Alldata = data.data.data;
           }else {
               layer.msg('拒绝访问');
           }
       }
    });
    function removeByVal(arrylist , val) {
        for(var i = 0; i < arrylist .length; i++) {
            if(arrylist [i] == val) {
                arrylist .splice(i, 1);
                break;
            }
        }
    }
    var inst1 = tree.render({
        id:'demo1',
        elem: '#demo1',  //绑定元素
        showCheckbox:true,
        data: Alldata,
        oncheck: function(obj){
            if(obj.checked==true){
                if(array.indexOf(obj.data.id)==-1){
                    child(obj.data);
                }
            }else{
                removeByVal(array,obj.data.id);
            }
        }
    });
    tree.setChecked('demo1',array);
    function child(data) {
        var datac = data.children;
        if(datac!=null){
            for(let index in datac) {
                child(datac[index])
            };
        }
        else{
            array.push(data.id);
        }
    }

    $(".save").on('click',function () {
        var rolename = $("#rolename").val();
        if (rolename == "" || rolename == null) {
            layer.msg('请输入角色名称！');
            return false;
        }
        $.ajax({
            type: "POST",
            url: HOST+"admin/permission/savePermission",
            traditional:true,
            data:{
                rolename:$("#rolename").val(),
                permissionIdArray:array
            },
            dataType: "json",
            async:false,
            success:function (data) {
                if(data.code==200){
                layer.msg('保存成功',{
                    icon:1,
                    time:1000,
                    end:function () {
                        window.parent.location.reload();
                    }
                })
                }else if (data.code==500){
                    layer.msg('保存失败',{
                        icon:2,
                        time:1000,
                        end:function () {
                            window.parent.location.reload();
                        }
                    })
                }else {
                    layer.msg('拒绝访问');
                }
            }
        });
    })
</script>
</html>
